<script>
import { ElMessage } from 'element-plus';

export default {
    data() {
        return {
      
            length:'',
            list: [],
            fits: [
                'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
                'https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg',
                'https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg',
                'https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg',
                'https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg',
                'https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg',

            ],
            // open4: () => {
            //     ElMessage({
            //         showClose: true,
            //         message: '审核驳回成功,发布失败',
            //         type: 'success',
                    
            //     })
            // },
             open2: () => {
                ElMessage({
                    showClose: true,
                    message: '审核通过，发布成功',
                    type: 'success',
                })
            }
        }
    },
    methods: {
       open4(){
            // for (let i = 0; i <=localStorage.length; i++) {
                
            //      this.length = localStorage.splice(0,localStorage.length)
                
            // }
            // localStorage=this.length
            localStorage.clear()
            this.$router.go(0)
            ElMessage.success('驳回成功')
           
            
        }
    },
    mounted(){
        this.list=[
      localStorage.getItem('names'),
      localStorage.getItem('ddtime'),
      localStorage.getItem('img'),
      localStorage.getItem('str'),
      localStorage.getItem('headSculpture'),
    ]
        console.log(this.list);


    this.img=this.list[2]
    }
}

</script>



<template>
    <span class="shenhe">待审核列表 </span>

    <div class="box">

<div v-if="list[0]!==null" >
        <div class="text"> <el-avatar :size="50" 
      :src= "list[4]"  />

    <el-text  class="mx-1" size="large">{{ list[0] }}</el-text>
    <el-text class="mx-1" size="large">{{ list[1] }}</el-text>
    <el-text class="mx-1" size="large">{{ list[3] }}</el-text>
    <el-button type="danger" class="bohui" :plain="true" @click="open4">驳回</el-button>
    <el-button type="success" :plain="true" @click="open2">同意</el-button>
  </div>
  <div class="demo-image">
    <div  class="nice">
      <span class="demonstration">{{ list[5]  }}</span>
      <el-image  style="width: 320px; height: 280px" :src="this.list[2]"
        :initial-index="4" :zoom-rate="1.2" />
        
    </div>
  </div></div>




        <div class="text"><el-avatar :size="50"
                src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fblog%2F202101%2F16%2F20210116225104_9d860.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1681563227&t=a51e7ec40617d5e5bf64fad909d04ad7" />

            <el-text class="mx-1" size="large">杨老师</el-text>
            <el-text class="mx-1" size="large">2022-01-20 14:00</el-text>
            <el-text class="mx-1" size="large">开心的班会</el-text>

            <el-button type="danger" class="bohui" :plain="true" @click="open4">驳回</el-button>
            <el-button type="success" :plain="true" @click="open2">同意</el-button>
        </div>
        <div class="demo-image">
            <div v-for="fit in fits" :key="fit" class="block">
                <!-- <span class="demonstration">{{ fit }}</span> -->
                <el-image style="width: 320px; height: 280px" :src="fit" :preview-src-list="fits" :initial-index="4"
                    :zoom-rate="1.2" />
            </div>
        </div>



<!-- 
        <div class="text"><el-avatar :size="50"
                src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fblog%2F202101%2F16%2F20210116225104_9d860.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1681563227&t=a51e7ec40617d5e5bf64fad909d04ad7" />

            <el-text class="mx-1" size="large">杨老师</el-text>
            <el-text class="mx-1" size="large">2022-01-20 14:00</el-text>
            <el-text class="mx-1" size="large">开心的班会</el-text>

            <el-button type="danger" class="bohui" :plain="true" @click="open4">驳回</el-button>
            <el-button type="success" :plain="true" @click="open2">同意</el-button>
        </div>
        <div class="demo-image">
            <div v-for="fit in fits" :key="fit" class="block">
              
                <el-image style="width: 320px; height: 280px" :src="fit" :preview-src-list="fits" :initial-index="4"
                    :zoom-rate="1.2" />
            </div>
        </div>
         -->



         
    </div>
</template>

  
<style lang="scss" scoped>
.shenhe {
    font-size: 20px;
}

.demo-image__error .el-image {
    width: 100%;
    height: 200px;

}

.demo-image {
    margin-left: 80px;


}

.box {
    margin-top: 50px;

    border: 1px solid black;

}

.text {
    display: flex;
    margin-top: 80px;
    margin-left: 30px;

    .bohui {
        margin-left: 600px;
    }


    .el-text {
        color: black;
        margin-left: 35px;
    }

}

.demo-image .block {
    padding: 30px 10px 10px 20px;
    text-align: center;
    /* border-right: solid 1px var(--el-border-color); */
    display: inline-block;
    width: 30%;
    box-sizing: border-box;
    /* vertical-align: top; */
}

.demo-image .block:last-child {
    border-right: none;
}

/* .demo-image .demonstration {
  display: block;
  color: var(--el-text-color-secondary);
  font-size: 14px;
  margin-bottom: 20px;
} */
</style>